<template>
  <div>
    <p>商品清单如下：</p>
    <div v-for="(item, index) in arr" :key="index">
      {{ item.shopName }} {{ item.price }}元/份
    </div>
    
    <BuyFood :list="arr"></BuyFood>
  </div>
</template>

<script>
import BuyFood from "./components/BuyFood.vue";
export default {
  components: { BuyFood },
  data() {
    return {
      arr: [
        {
          shopName: "可比克薯片",
          price: 5.5,
          count: 0,
        },
        {
          shopName: "草莓酱",
          price: 3.5,
          count: 0,
        },
        {
          shopName: "红烧肉",
          price: 55,
          count: 0,
        },
        {
          shopName: "方便面",
          price: 12,
          count: 0,
        },
      ],
    };
  },
};
</script>

<style>
</style>